import G6 from '@antv/g6';
import * as _G6 from '@antv/g6';
import { v4 as uuidv4 } from 'uuid';

export const EDITOR_CONTEXT_MENU = (graph: _G6.Graph) =>
  new G6.Menu({
    getContent(evt) {
      if (evt.target && evt.target.isCanvas && evt.target.isCanvas()) {
      } else if (evt.item) {
        const itemType = evt.item.getType();
      }
      return `
                <div>
                  <a>new combo</a>
                </div>
                `;
    },
    handleMenuClick: (target, item) => {
      console.log(target, item);
      graph.createCombo({
        id: uuidv4(),
        label: 'Combo 2' 
      },[]);
    },
    // offsetX and offsetY include the padding of the parent container
    // 需要加上父级容器的 padding-left 16 与自身偏移量 10
    offsetX: 16 + 10,
    // 需要加上父级容器的 padding-top 24 、画布兄弟元素高度、与自身偏移量 10
    offsetY: 0,
    // the types of items that allow the menu show up
    // 在哪些类型的元素上响应
    itemTypes: ['canvas', 'node', 'edge', 'combo'],
  });
